<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>团购商城</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <script src="<%=request.getContextPath()%>/resources/js/jquery.min.js"></script>

    <link rel="stylesheet" href="<%=request.getContextPath()%>/resources/css/title.css">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/resources/css/footer.css">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/resources/css/index.css">
    <link rel=" stylesheet" href="<%=request.getContextPath()%>/resources/font-awesome-4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/resources/css/index_css.css">
</head>
<body onmousewheel="return false;">
<header class="bar bar-nav">
    <h1 class='title'>团购商城</h1>
</header>
<nav class="topnav">
    <ul class="topul">
        <c:forEach items="${types}" var="type">
            <li><a href="###">${type.goodsType}</a></li>
        </c:forEach>
    </ul>
</nav>
<!--商品的列表-->
<div class="outer">
    <ul>
        <%--<li><img src='${${not empty meg} pageContext.request.contextPath}/resources/images/s2.png'><div class='div'><h2>水晶葡萄</h2><p>生长于中国葡萄之乡大泽山，为自家果园种植，整个生长过程均为葡萄自然生长不打农药，施用有机肥，整个生长过程套有无菌纸袋做到了真正的有机无公害。大泽山葡萄均为沙地生长例大饱满、皮薄肉厚、香甜可口，是自己食用或馈赠之佳品。</p></div><div>团购:￥<button>88.0</button>单人:￥<button>20.0</button>团购人数:<button>5</button></div></li>--%>
        <%--<li class='in_list'><div class='bg'><div class='cen'><div class='tip'><span class='fl'><span class='redBig'>￥58.9</span><span class='little'>￥108.5</span></span><span class='fr'>拼团目标人数：<span class='num'>15</span></span></div><div class='title'>大泽山一号泽玉泽香白玫瑰香绿葡萄水晶葡萄新鲜水果四斤顺丰包邮</div></div></div></li>--%>

    </ul>
</div>
<script>
    function changeGroupType(typeId) {
        $.ajax({
            url: "${ pageContext.request.contextPath}/group-list?typeId=" + typeId,
            type: 'get',
            dataType: 'json',
            timeout: 1000,
            cache: false,
            success: function (tt) {
                var groups = eval(tt);
                $(".outer ul li").remove();
                for (var i = 0; i < groups.length; i++) {
//                    var date = new  Date((acts[i].startTime));
//                    var datetime = date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate();
                    console.log(groups[i]);
                    var innerHtml = "<li  onclick=\"turnHref('${pageContext.request.contextPath}/login-user/group?groupId="+groups[i].groupId+"')\" class='in_list'><div class='bg' style='background:url(\"${ pageContext.request.contextPath}/resources/images/" + groups[i].imgAddress + "\")no-repeat 50%;background-size:100%; '><div class='cen'><div class='tip'><span class='fl'><span class='redBig'>￥" + groups[i].price + "</span><span class='little'>￥" + groups[i].priceOriginal + "</span></span><span class='fr'>拼团目标人数：<span class='num'>" + groups[i].groupTargetNumber + "</span></span></div><div class='title_list'>" + groups[i].groupTitle + "</div></div></div></li>";


//                    console.log(news[i]);
                    $(".outer ul").append(innerHtml);
                }
            }
        });
    }
</script>
<script>changeGroupType(1)</script>
<script>
    function turnHref(href){
        window.location.href=href;
    }
</script>
<!--底部的三个按钮-->
<ul class="footer">
    <a href="${pageContext.request.contextPath}/login-user/index" target="_self">
        <li class="footerselect"><span class="fa fa-home "></span><br>
            <p>首页</p></li>
    </a>
    <a href="  ${pageContext.request.contextPath}/login-user/my-group-list" target="_self">
        <li><span class="fa fa-user-circle-o "></span><br>
            <p>我的团</p></li>
    </a>
    <a href="${pageContext.request.contextPath}/login-user/my-order-list" target="_self">
        <li><span class="fa fa-cart-plus "></span><br>

            <p>订单</p></li>
    </a>
</ul>


</body>
<script src="<%=request.getContextPath()%>/resources/js/jquery.mobile.min.js"></script>
<script src="<%=request.getContextPath()%>/resources/js/velocity.min.js"></script>
<script src="<%=request.getContextPath()%>/resources/js/velocity.ui.min.js"></script>
<script src="<%=request.getContextPath()%>/resources/js/index.js"></script>
<script src="<%=request.getContextPath()%>/resources/js/public.js"></script>
</html>